Durable Objects触ってみた話
Durable Objects触ってみた話
丹さんからDOの話を聞いて、面白そう、やってみるかとなってやってみたmiyamonz.icon
pages かworkerか
組み合わせが色々あります
pages + pages functions
pages + functions advanced mode
worker + site
結局これがいいmiyamonz.icon
pages (+ functions) + worker (service binding)
pagesベースでDO動かそうとして散々困って、結局しんどいことが分かった
かなり無駄に時間を食った
結局workers + site構成がlocalでもdevでもちゃんと動いて楽
DOとか最新の機能を触りたいなら、まだworker + site使うのが安心っぽい
最新の機能が目的でなくても、worker + siteはちゃんと動くししばらくこっちで良いのでは
実際のデモ
雑なお絵描きチャット
実装はクソ雑です
worker部分は公式のchatサンプルをちょっといじっただけ
mouse positionを富豪的にwebsocketで皆に投げてます
これを本番等で使うと費用は怖い（計算してない
request数と容量x時間(GB-s)で課金か
Requests including all incoming HTTP requests, WebSocket messages, and alarm invocations. There is no charge for outgoing WebSocket messages.
そうなんだすごいmiyamonz.icon
エッジ側からいっぱいなんか流す場合は無料?
https://gyazo.com/51880b019cc506b2bc1324c479ef7048.mp4
実装ライブラリ詳細
worker
公式サンプルを元にして
tsにして型つけた
ファイル分割した
hono使った
hono便利
honoいいよねtan_t.icon
front
vite, react, jotai
jotaiはv2になって、atomのsubscribeとかをreact外で書けるようになったので、reactiveなコード書きやすくなった
React部分はUIだけ扱い、データのハンドリングとか状態の変化はjotai側で書いて、結果の情報だけをuseAtomでUIが触る、みたいな
websocketから飛んできた情報をcanvasのrendering contextに描くとか
こまけえ話
wrangler側の設定で、buildのコマンドとかwatchとかはあるが
viteの場合、viteのdev server立てるんじゃなくて、vite build -wでwatchしてビルド結果を書き出すやつやるといいかも
保存時にブラウザのrefleshかけられない。いい方法無いかな